<template>
  <div class="flex flex-col min-h-screen overflow-hidden">
    <!-- Site header -->
    <Header />

    <!-- Page content -->
    <main class="grow">
      <!-- 轮播图 -->
      <section class="mt-20"></section>
      <Carousel />
      <OurServices />
      <CompanyOverview />
      <OurAdvantage />
      <WorkWithUS />
      <TrustedCompanies />
      <ClientTestimonials />
      <FactoryTour class="mt-16"/>
      <CompanyBlogs class="mt-16" />
      <GetQuote class="get-quote" />
    </main>

    <!-- Site footer -->
    <Footer />
  </div>
</template>

<script setup>
import Header from '../components/common/Header.vue'
import Carousel from '../components/Home/Carousel.vue'
import OurServices from '../components/Home/OurServices.vue'
import CompanyOverview from '../components/Home/CompanyOverview.vue'
import OurAdvantage from '../components/Home/OurAdvantage.vue'
import WorkWithUS from '../components/Home/WorkWithUS.vue'
import TrustedCompanies from '../components/Home/TrustedCompanies.vue'
import ClientTestimonials from '../components/Home/ClientTestimonials.vue'
import FactoryTour from '../components/Home/FactoryTour.vue'
import CompanyBlogs from '../components/Home/CompanyBlogs.vue'
import GetQuote from '../components/GetQuote.vue'
import Footer from '../components/common/Footer.vue'
</script>

<style>
.get-quote {
  width: 71.25rem;
  margin: 6rem auto 0.75rem auto;
}
</style>
